/*
 * @Description:
 * @Author: huxianc
 * @Date: 2020-12-07 16:12:08
 * @LastEditors: huxianc
 * @LastEditTime: 2020-12-09 13:59:53
 */

/**
 *
 * @param fn {Function}   实际要执行的函数
 * @param delay {Number}  延迟时间，也就是阈值，单位是毫秒（ms）
 * @return {Function}     返回一个“去弹跳”了的函数
 */
function debounce(fn, delay) {
  // 定时器，用来 setTimeout
  var timer;

  // 返回一个函数，这个函数会在一个时间区间结束后的 delay 毫秒时执行 fn 函数
  return function () {
    // 保存函数调用时的上下文和参数，传递给 fn
    var context = this;
    var args = arguments;

    // 每次这个返回的函数被调用，就清除定时器，以保证不执行 fn
    clearTimeout(timer);

    // 当返回的函数被最后一次调用后（也就是用户停止了某个连续的操作），
    // 再过 delay 毫秒就执行 fn
    timer = setTimeout(function () {
      fn.apply(context, args);
    }, delay);
  };
}

// document.documentElement.style.fontSize = "10px"
computedRem();
function computedRem() {
  const docEl = document.documentElement;
  let width = document.body.clientWidth || document.documentElement.clientWidth;
  width = width > 1344 ? 1344 : width;
  docEl.style.fontSize = width / 134.4 + "px";
}

function resizeRem() {
  debounce(computedRem(), 100);
}

window.addEventListener("resize", resizeRem);

function $q(ele) {
  return document.querySelector(ele);
}

/**
 * @description: 上半部分时间初始化
 * @param {date} date
 * @return {*}
 */
function getTime(date = new Date()) {
  const y = date.getFullYear();
  let mt = date.getMonth() + 1;
  mt = mt < 10 ? `0${mt}` : mt;
  const d = date.getDate();

  let h = date.getHours();
  h = h < 10 ? `0${h}` : h;
  let m = date.getMinutes();
  m = m < 10 ? `0${m}` : m;
  let s = date.getSeconds();
  s = s < 10 ? `0${s}` : s;

  const w = date.getDay();

  const weeks = ["日", "一", "二", "三", "四", "五", "六"];

  $q(".time-box").innerText = `${h}:${m}:${s}`;
  $q(".day").innerText = `星期${weeks[w]}`;
  $q(".date").innerText = `${y}年${mt}月${d}日`;
}

getTime();
setInterval(() => {
  getTime();
}, 1000);

// 滚动
const TABLE = {
  line: "#table_line",
  box: ".table-line-container",
};
// scrollFunc("#social");
function scrollFunc(dom, type = 0) {
  const box = $q(dom).querySelector(TABLE.box);
  console.log(box.scrollTop);
  const el = $q(dom).querySelector("#table_line");
  console.log(window.getComputedStyle(el).height);
  const itemHeightStr = window.getComputedStyle(el).height;
  const itemHeight = parseFloat(
    itemHeightStr.substr(0, itemHeightStr.length - 2)
  );
  console.log(itemHeight);
  setInterval(() => {
    box.scrollTop += itemHeight;
  }, 500);
  console.log(el.style.height);
  console.log($q(TABLE.line));
}

(function ($) {
  $.fn.extend({
    Scroll: function (opt, callback) {
      //参数初始化
      if (!opt) var opt = {};
      var _btnUp = $("#" + opt.up); //Shawphy:向上按钮
      var _btnDown = $("#" + opt.down); //Shawphy:向下按钮
      var timerID;
      var _this = this.eq(0).find("ul:first");
      var lineH = _this.find("li:first").height(), //获取行高
        line = opt.line
          ? parseInt(opt.line, 10)
          : parseInt(this.height() / lineH, 10), //每次滚动的行数，默认为一屏，即父容器高度
        speed = opt.speed ? parseInt(opt.speed, 10) : 500; //卷动速度，数值越大，速度越慢（毫秒）
      timer = opt.timer; //?parseInt(opt.timer,10):3000; //滚动的时间间隔（毫秒）
      if (line == 0) line = 1;
      var upHeight = 0 - line * lineH;
      //滚动函数
      var scrollUp = function () {
        _btnUp.unbind("click", scrollUp); //Shawphy:取消向上按钮的函数绑定
        _this.animate(
          {
            marginTop: upHeight,
          },
          speed,
          function () {
            for (i = 1; i <= line; i++) {
              _this.find("li:first").appendTo(_this);
            }
            _this.css({ marginTop: 0 });
            _btnUp.bind("click", scrollUp); //Shawphy:绑定向上按钮的点击事件
          }
        );
      };
      //Shawphy:向下翻页函数
      var scrollDown = function () {
        _btnDown.unbind("click", scrollDown);
        for (i = 1; i <= line; i++) {
          _this.find("li:last").show().prependTo(_this);
        }
        _this.css({ marginTop: upHeight });
        _this.animate(
          {
            marginTop: 0,
          },
          speed,
          function () {
            _btnDown.bind("click", scrollDown);
          }
        );
      };
      //Shawphy:自动播放
      var autoPlay = function () {
        if (timer) timerID = window.setInterval(scrollUp, timer);
        //if (timer) timerID = window.setInterval(scrollUp, timer);
      };
      var autoStop = function () {
        if (timer) window.clearInterval(timerID);
      };
      //鼠标事件绑定
      _this.hover(autoStop, autoPlay).mouseout();
      _btnUp.css("cursor", "pointer").click(scrollUp).hover(autoStop, autoPlay); //Shawphy:向上向下鼠标事件绑定
      _btnDown
        .css("cursor", "pointer")
        .click(scrollDown)
        .hover(autoStop, autoPlay);
    },
  });
})(jQuery);
$("#scrollBox01").Scroll({
  line: 1,
  speed: 500,
  timer: 3000,
  up: "but_up01",
  down: "but_down01",
});
$("#scrollBox02").Scroll({
  line: 1,
  speed: 500,
  timer: 2000,
  up: "but_up02",
  down: "but_down02",
});
$("#scrollBox03").Scroll({
  line: 1,
  speed: 500,
  timer: 1500,
  up: "but_up03",
  down: "but_down03",
});
$("#scrollBox04").Scroll({
  line: 1,
  speed: 500,
  timer: 1500,
  up: "but_up04",
  down: "but_down04",
});
$("#scrollBox05").Scroll({
  line: 1,
  speed: 500,
  timer: 1500,
  up: "but_up05",
  down: "but_down05",
});

// 弹窗
$q("#close_btn").addEventListener("click", closeBtn);
function closeBtn() {
  $q("#dialog").style.display = "none";
}

// 放在最后隐藏loading
document.querySelector(".loading-container").style.display = "none";
